<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>博客个人管理系统</title>
    <link rel="stylesheet" href="layui-v/layui/css/layui.css">
    <script src="layui-v/layui/layui.js" type="text/javascript"></script>
    <script src="js/jquery.min.js"></script>
</head>
<body class="layui-layout-body">
<div class="layui-layout layui-layout-admin">
    <div class="layui-header">
        <div class="layui-logo">后台管理</div>
        <!-- 头部区域（可配合layui已有的水平导航） -->
        <ul class="layui-nav layui-layout-left">
            <li class="layui-nav-item"><a href="home.html">前台</a></li>
            <li class="layui-nav-item"><a href="">消息管理</a></li>
            <li class="layui-nav-item"><a href="">用户</a></li>
            <li class="layui-nav-item">
                <a href="javascript:;">其它系统</a>
                <dl class="layui-nav-child">
                    <dd><a href="">邮件管理</a></dd>
                    <dd><a href="">信息管理</a></dd>
                    <dd><a href="">授权管理</a></dd>
                </dl>
            </li>
        </ul>
        <ul class="layui-nav layui-layout-right">
            <li class="layui-nav-item">
                <a href="javascript:;">
                    <img src="../img/1%20(82).jpg" class="layui-nav-img">
                    海浪
                </a>
                <dl class="layui-nav-child">
                    <dd><a href="">基本资料</a></dd>
                    <dd><a href="">安全设置</a></dd>
                </dl>
            </li>
            <li class="layui-nav-item"><a href="">退了</a></li>
        </ul>
    </div>

    <div class="layui-side layui-bg-black">
        <div class="layui-side-scroll">
            <!-- 左侧导航区域（可配合layui已有的垂直导航） -->
            <ul class="layui-nav layui-nav-tree"  lay-filter="test">
                <li class="layui-nav-item layui-nav-itemed">
                    <a class="" href="javascript:;">所有消息</a>
                </li>
                <li class="layui-nav-item"><a href="index.html">发布消息</a></li>
            </ul>
        </div>
    </div>

    <div class="layui-body">
        <!-- 内容主体区域 -->
        <div class="layui-card-body ">
            <table class="layui-table" id="supplier" lay-filter="supplier">
                <div class="layui-inline">
                    <input type="text" value="" placeholder="请输入姓名" class="layui-input search_input" id="sm_no">
                </div>
                <div class="layui-inline">
                    <button class="layui-btn layui-btn-sm" id="serch_btn" onclick="serch_btn()">查询</button>
                    <button class="layui-btn layui-btn-sm" lay-event="add">新增</button>
                    <button class="layui-btn layui-btn-sm" lay-event="del" id="nima">批量删除</button>
                </div>
                <script type="text/html" id="bars">
                    <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
                    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
                </script>

            </table>

            <script type="text/html" id="toolbarDemo">
                <div class="layui-btn-container demoTable">
                    <button class="layui-btn layui-btn-sm layui-btn-danger" lay-event="batchdel" data-type="getCheckData"><i class="layui-icon layui-icon-delete" style="font-size:20px;"></i> 批量删除</button>
                </div>
            </script>

            <div id="pageUD"></div>
        </div>
    </div>

    <div class="layui-footer">

    </div>
</div>



<script>
    var pageNum = 0;
    var limit = 10;
    var page = 1;
    // $.ajax({
    //     url: "laypage.php",
    //     async: true,
    //     type: "post",
    //     success: function (res) {
    //         pageNum = res;
    //         //取到数据总条数
    //         // console.log(res)
    //     }
    // });
    layui.use('table', function () {
        var table = layui.table;

        table.render({
            elem: '#supplier',
            toolbar: '#toolbarDemo',
            defaultToolbar: ['filter', 'exports', 'print', {
                title: '提示',
                layEvent: 'LAYTABLE_TIPS',
                icon: 'layui-icon-tips'
            }],
            method: 'post',
            url: 'paging.php',
            limit: limit,
            page: page,
            cellMinWidth: 80,
            cols: [[
                {checkbox: true},
                {field: 'ID', width: 80, sort: true, title: 'ID'},
                {field: 'username', width: 120, sort: true, title: '姓名/昵称'},
                {field: 'time', width: 120, sort: true, title: '发布时间'},
                {field: 'remark', width: 750, title: '备注/留言'},
                {title: '操作', minWidth: 150, toolbar: '#bars', align: "center"}
            ]],
            done: function () {
                layer.closeAll('loading');
            }

        });
        table.on('tool(supplier)', function(obj) {
            var data = obj.data;
            // console.log(data.ID)
            if (obj.event === 'del') {
                layer.confirm('确定删除此项?', function(index) {
                    obj.del();
                    layer.close(index);
                    var co_no = data.ID;
                    $.ajax({
                        url:"delete.php",
                        type:"post",
                        data:{
                            'ID':co_no
                        },

                    })
                    layer.msg("删除成功");
                });
            }
        });





        //批量删除
        //监听点击
        $('.demoTable .layui-btn').on('click', function(){
            var type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });
        //监听表格复选框选择
        table.on('checkbox(table1)', function(obj){
            console.log(obj);
        })
        active = {
            getCheckData: function(){ //获取选中数据
                var checkStatus = table.checkStatus('tableAll')
                var checkData = checkStatus.data
                var delList=[];

                for (var i = 0; i < checkData.length; i++) {
                    delList.push(checkData[i].ID);
                }
                console.log(checkData);
                // $.ajax({
                //     url:"delete.php",
                //     type:'post',
                //     data:{
                //         ID:checkData
                //     },
                //
                //     success:function(data){
                //         if (data == 0) {
                //             layer.msg('删除失败！',{icon:5,offset:"auto",time:2000});//提示框
                //         }else{
                //             layer.msg('删除成功！',{icon:6,offset:"auto",time:2000});//提示框
                //         }
                //
                //         setTimeout(function(){
                //             location.reload();//重新加载页面表格
                //         }, 2100);
                //     }
                // })
            }
        };


    });



</script>



<script>
    //JavaScript代码区域
    layui.use('element', function(){
        var element = layui.element;

    });
</script>
</body>
</html>


